// 1, 模块化
import Vue from 'vue'
import VueRouter from 'vue-router'
// 在项目中明确的安装路由功能
Vue.use(VueRouter)

// import login from '@/views/Login.vue'

// 2.创建路由模块对象并配置路由
const router = new VueRouter({
    routes: [
        // 添加单个的具体的路由配置
        // path:路由路径   component:组件实例  redirect:重定向  name:路由名称  meta:元数据  children：嵌套路由
        {
            path: '/',
            redirect: { name: 'login' }
        },
        {
            name: 'login',
            path: '/login',
            // component: login
            // 懒加载组件：只有当路由映射到这个组件才会进行这个组件的加载
            component: () => import('@/views/login.vue')
        },
        {
            name: 'register',
            path: '/register',
            // 懒加载组件：只有当路由映射到这个组件才会进行这个组件的加载
            component: () => import('@/views/register.vue')
        },
        {
            name: 'personal',
            path: '/personal/:id',
            // 懒加载组件：只有当路由映射到这个组件才会进行这个组件的加载
            component: () => import('@/views/personal.vue')
        },
        {
            name: 'editpersonal',
            path: '/editpersonal/:id',
            // 懒加载组件：只有当路由映射到这个组件才会进行这个组件的加载
            component: () => import('@/views/editpersonal.vue')
        }
    ]
})

// 添加导航守卫
const routerList = ['personal', 'editPersonal'] // 黑名单
// to:目标路由对象
// from:源路由对象
// next:下一步操作，一定要记得调用next,否则跳转到中止
router.beforeEach((to, from, next) => {
    if (routerList.indexOf(to.name) !== -1) {
        let token = localStorage.getItem('EvToken')
        if (token) {
            next()
        } else {
            // 重定向到登陆页
            next({ path: '/login' })
        }
    } else { // 不用登陆可以自由跳转
        next()
    }
})



//3. 暴露
export default router